<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/webpage/include/taglib.jsp" %>
<%@ include file="/webpage/include/weChatHead.jsp" %>
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>项目添加</title>
    <meta name="decorator" content="default"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
          content="width=device-width, initial-scale=1, user-scalable=no">
    <link href="${ctxStatic}/plugin/jquery-weui/lib/weui.min.css " type="text/css"
          rel="stylesheet"/>
    <link href="${ctxStatic}/plugin/jquery-weui/css/jquery-weui.css"
          type="text/css" rel="stylesheet"/>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#inputForm").validate({
                submitHandler: function (form) {
                    jp.loading();
                    form.submit();
                },
                errorContainer: "#messageBox",
                errorPlacement: function (error, element) {
                    $("#messageBox").text("输入有误，请先更正。");
                    if (element.is(":checkbox") || element.is(":radio") || element.parent().is(".input-append")) {
                        error.appendTo(element.parent().parent());
                    } else {
                        error.insertAfter(element);
                    }
                }
            });

        });

        var cIds = [];
        var cNames = [];
        function checkMember() {
            jp.openUserSelectDialog(true, function (ids, names) {
                ids = ids.split(",");
                names = names.split(",");
                if (ids[0] == '') {
                    ids.shift();
                    names.shift();
                }

                for (var i = 0; i < ids.length; i++) {
                    var hasIds = false;
                    for (var j = 0; j < cIds.length; j++) {
                        if(cIds[j] == ids[i]){
                            hasIds = true;
                        }
                    }
                    if(!hasIds){
                        cIds.push(ids[i]);
                        cNames.push(names[i]);
                    }
                }
                var idsArr = '';
                var namesArr = '';
                $("#projectMemberList").html("");
                for (var i = 0; i < cIds.length; i++) {
                    idsArr = (idsArr + cIds[i]) + (((i + 1) == cIds.length) ? '' : ',');
                    namesArr = (namesArr + cNames[i]) + (((i + 1) == name.length) ? '' : ',');
                    var tr = '<tr><td>' + cNames[i] + '</td></tr>';
                    $('#projectMemberList').append(tr);

                }
                $('#idsArr').val(idsArr);
                $('#namesArr').val(namesArr);
                console.log($('#idsArr').val());
            })

        };


    </script>
</head>

<body class="hideScroll">
<form:form id="inputForm" modelAttribute="projectInfo" action="${ctx}/project/projectInfo/weChatSave" method="post"
           class="form-horizontal">
    <form:hidden path="id"/>
    <sys:message content="${message}"/>
    <input id="idsArr" type="hidden" name="idsArr" value="${idsArr}"/>
    <table
            class="table table-bordered  table-condensed dataTables-example dataTable no-footer">
        <tbody>
        <tr>
            <td class="width-15 active"><label class="pull-right"
                                               style="font-size:14px"><font color="red">*</font>项目名称：</label></td>
            <td class="width-35"><form:input path="projectName"
                                             htmlEscape="false" class="form-control required"/></td>

        </tr>
        <tr>
            <td class="width-15 active"><label class="pull-right"
                                               style="font-size:14px"><font color="red">*</font>项目经理：</label></td>
            <td class="width-35">
                    <sys:userselect id="projectManager" name="projectManager.id"
                                    value="${projectInfo.projectManager.id}" labelName="projectManager.name"
                                    labelValue="${projectInfo.projectManager.name}"
                                    cssClass="form-control "/>
                    <%--<sys:treeselect id="projectManager"
                        name="projectManager.id" value="${projectInfo.projectManager.id}"
                        labelName="projectManager.name"
                        labelValue="${projectInfo.projectManager.name}" title="用户"
                        url="/sys/office/treeData?type=3"
                        cssClass="form-control required" allowClear="true"
                        notAllowSelectParent="true" /></td>--%>
        </tr>
        </tbody>
    </table>

    <div class="tabs-container">
        <ul class="nav nav-tabs">
            <li class="active"><a data-toggle="tab" href="#tab-1"
                                  aria-expanded="true" style="font-size:14px">项目成员：</a></li>
        </ul>
        <div class="tab-content">
            <div id="tab-1" class="tab-pane active">
                <a class="btn btn-outline btn-primary btn-sm"
                   onclick="checkMember()"><i class="fa fa-plus"></i> 添加人员</a>
                <table id="contentTable"
                       class="table table-striped table-bordered table-hover table-condensed dataTables-example dataTable">
                    <thead>
                    <tr>
                        <th>姓名</th>
                    </tr>
                    </thead>
                    <tbody id="projectMemberList">
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <div class='demos-content-padded'>
        <button class="weui_btn weui_btn_primary" data-loading-text="正在提交...">提 交</button>
    </div>
</form:form>
</body>
</html>